<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
    <meta name="description" content="" />
    <meta name="author" content="" />

    <title>Starter Template for Bootstrap</title>
    <link
      rel="stylesheet"
      href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
      integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
      crossorigin="anonymous"
    />
  </head>

  <body>
    <main role="main" class="container">
      <div class="form-group row">
        <label for="registerId" class="col-sm-2 col-form-label col-form-label-sm">registerId:</label>
        <div class="col-sm-4">
          <input type="text" class="form-control form-control-sm" id="registerId" />
        </div>
        <button class="col-sm-2" id="register" class="btn btn-primary btn-sm btn-block">register</button>
      </div>

      <div class="form-group row">
        <label for="callId" class="col-sm-2 col-form-label col-form-label-sm">callId:</label>
        <div class="col-sm-4">
          <input type="text" class="form-control form-control-sm" id="callId" />
        </div>
        <button class="col-sm-2" id="call" class="btn btn-primary btn-sm btn-block">call</button>
      </div>

      <div class="form-group row" id="incomingDialog" style="display: none;">
        <span class="col-sm-2">Answer incomingcall ?</span>
        <button class="col-sm-2" id="incoming-ok" class="btn btn-primary btn-sm btn-block">ok</button>
        <button class="col-sm-2" id="incoming-cancle" class="btn btn-primary btn-sm btn-block">cancle</button>
      </div>

      <div class="form-group row">
        <button class="col-sm-2" id="hangup" class="btn btn-primary btn-sm btn-block">hangup</button>
        <span class="col-sm-4">After hangup, must be register again</span>
      </div>

      <video id="localvideo"></video>
      <video id="remotevideo"></video>
    </main>
    <!-- /.container -->

    <script src="https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/dist/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap/"></script>
    <!-- <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> -->
    <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> -->
    <!-- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> -->

    <script type="text/javascript" src="videocall.bundle.js"></script>
  </body>
</html>
